<template>
  <view>
    <Form :formOption="option" ref="form" @onSubmit="onSubmit">
      <template #applyCompany>
        <uni-forms-item label="作业申请部门" required name="applyCompany">
          <view style="display: flex">
            <uni-easyinput
              type="text"
              disabled
              v-model="formData.applyCompany"
            />
            <button size="mini" @click.native="openTree">选择</button>
          </view>
        </uni-forms-item>
      </template>
    </Form>
    <view>
      <TreeDept
        v-show="showTree"
        :data="deptTree"
        :id="[]"
        :checkStrictly="true"
        @getChooseValue="getChooseDept"
        @close="closeTree"
      />
    </view>
  </view>
</template>

<script setup>
import Form from "./components/form.vue";
import { onMounted, ref, getCurrentInstance } from "vue";
import option from "./components/option";
import { apis as APIS } from "@/api/zygl/zyjh.js";
import { apis } from "@/api/zygl/zyp";
import { router } from "@/router/index.js";
import { formatDate } from "@/utils/index.js";
import { getUserProfile } from "@/api/user.js";
import { getDeptTree } from "@/api/common.js";
import TreeDept from "@/components/treeSelect/index.vue";
const formOptions = ref([]);
const onSubmit = (data) => {
  let glzyps = [];
  APIS.add({
    ...data,
    ...formData.value,
    jobType: data.jobType?.join(",") || "",
    jobPersonnel: JSON.stringify(data.jobPersonnel),
  }).then((res) => {
    uni.showToast({
      title: "提交成功",
    });
    setTimeout(() => {
      router.back();
    }, 500);
  });
};
const form = ref();
const formData = ref({});
const zyryList = ref([]);
const userInfo = ref({});
const zypList = ref([]);

const deptTree = ref([]);
onMounted(() => {
  getDeptTree().then((res) => {
    deptTree.value = res.data;
  });
});
// 组织树 责任人 相关逻辑
const showTree = ref(false);
const closeTree = () => {
  showTree.value = false;
};
const openTree = () => {
  showTree.value = true;
};
const getChooseDept = (ids, item) => {
  formData.value.applyCompany = item[item.length - 1].label;
  formData.value.applyCompanyId = item[item.length - 1].id;
};
</script>

<style lang="scss" scoped>
.input-num {
  display: inline-block;
  width: 50px;
  border-bottom: 1px solid #000;
  font-size: 13px;
  padding: 0 !important;
  vertical-align: middle;
}
.navbar {
  display: flex;
  height: 40px;
  padding: 0 5px;
  background: #fff;
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.06);
  position: relative;
  z-index: 10;

  .nav-item {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    font-size: 15px;
    position: relative;

    &.current {
      color: blue;

      &:after {
        content: "";
        position: absolute;
        left: 50%;
        bottom: 0;
        transform: translateX(-50%);
        width: 44px;
        height: 0;
        // border-bottom: 2px solid $base-color;
      }
    }
  }
}
</style>
